<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>阅学网后台管理系统</title>
<jsp:include page="common/common.jsp"></jsp:include>
<script type="text/javascript">
	$(function() {
	//tab关闭
	  tabClose();
   	 tabCloseEven();
		//左边树
		$('#tt').tree({
			url:'admin/menu/listMenus' ,
			lines:true,
			onClick:function(node){
					if(node.url){
						 	tab(node.text,node.url,node.iconCls);
					}
			}
		});
		 function tab(title,url,iconCls){
		 	if($('#tabs').tabs('exists',title)){//判断tab是否存在
		 	 	$('#tabs').tabs('select', title); //存在则获取tab
		 	}else{//不存在tab则创建
		 		$('#tabs').tabs('add', {
		        			  			title:  title,
		        			  			iconCls:iconCls,
		        			  			closable: true,
		        			  			fit:true,
		        			  			cls:'pd3',
		        			  			content:'<iframe id="iframeid" scrolling="auto" frameborder="0"  src="' + url + '" style="width:100%;height:100%;"></iframe>'
		      				});  
		 	}
		 		 tabClose();
		 }
		 

		/*右边日历*/
		/* $('#cc').calendar({
					current : new Date(),
					firstDay : 1,
					weeks : [ '日', '一', '二', '三', '四', '五', '六' ],
					months : [ '一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月',
							'九月', '十月', '十一月', '十二月' ]
			}); */
	
			/* $('#userDg').datagrid({    
				    url:'admin/list',    
				    columns:[[    
				        {field:'id',title:'Code',width:100},    
				        {field:'username',title:'Name',width:100},    
				        {field:'chName',title:'Price',width:100,align:'right'}    
				    ]]    
			});   */
		
		});
		
		function tabClose() {
		    /* 双击关闭TAB选项卡 */
		    $(".tabs-inner").dblclick(function() {
		        var subtitle = $(this).children(".tabs-closable").text();
		        $('#tabs').tabs('close', subtitle);
		    });
		    /* 为选项卡绑定右键 */
		    $(".tabs-inner").bind('contextmenu', function(e) {
		        $('#mm').menu('show', {
		            left: e.pageX,
		            top: e.pageY
		        });
		
		        var subtitle = $(this).children(".tabs-closable").text();
		        $('#mm').data("currtab", subtitle);
		        $('#tabs').tabs('select', subtitle);
		        return false;
		    });
}
// 绑定右键菜单事件
function tabCloseEven() {
    // 刷新
    $('#mm-tabupdate').click(function() {
        var currTab = $('#tabs').tabs('getSelected');
        var url = $(currTab.panel('options').content).attr('src');
        $('#tabs').tabs('update', {
            tab: currTab,
            options: {
                content: createFrame(url)
            }
        });
    });
    // 关闭当前
    $('#mm-tabclose').click(function() {
        var currtab_title = $('#mm').data("currtab");
        $('#tabs').tabs('close', currtab_title);
    });
    // 全部关闭
    $('#mm-tabcloseall').click(function() {
        $('.tabs-inner span').each(function(i, n) {
            var t = $(n).text();
            if('首页' != t){
            	$('#tabs').tabs('close', t);
            }
        });
    });
    // 关闭除当前之外的TAB
    $('#mm-tabcloseother').click(function() {
        $('#mm-tabcloseright').click();
        $('#mm-tabcloseleft').click();
    });
    // 关闭当前右侧的TAB
    $('#mm-tabcloseright').click(function() {
        var nextall = $('.tabs-selected').nextAll();
        if (nextall.length == 0) {
            return false;
        }
        nextall.each(function(i, n) {
            var t = $('a:eq(0) span', $(n)).text();
            if('首页' != t){
	            $('#tabs').tabs('close', t);
            }
        });
        return false;
    });
    // 关闭当前左侧的TAB
    $('#mm-tabcloseleft').click(function() {
        var prevall = $('.tabs-selected').prevAll();
        if (prevall.length == 0) {
            return false;
        }
        prevall.each(function(i, n) {
            var t = $('a:eq(0) span', $(n)).text();
            if('首页' != t){
	            $('#tabs').tabs('close', t);
            }
        });
        return false;
    });

    // 退出
    $("#mm-exit").click(function() {
        $('#mm').menu('hide');
    });
}
	function logout(){
		$.messager.confirm('确认','您确认要退出吗？',function(r){    
			if (r){
				window.location.href='admin/logout';    
			}
		});
	}
</script>
</head>

<body class="easyui-layout">
	<div class="park-header" data-options="region:'north',border:false,split:true">
	    	<div class="park-header-left">
	        	<h1>阅学网后台管理系统</h1>
	        </div>
	        <div class="park-header-right">
	        	<p><strong class="easyui-tooltip" title="${sessionScope.user.chName }">${sessionScope.user.chName }</strong>，欢迎您！</p>
	            <p><a href="#">帮助中心</a>|<a href="public/index">网站首页</a>|<a href="javascript:logout();">安全退出</a></p>
	        </div>
	 </div>
	<div data-options="region:'south',title:'South Title',split:false,noheader:true" style="height:30px;line-height: 30px;text-align: center;">@版权所有
			By代华军
	</div>
	<div id="west" data-options="region:'west',title:'菜单导航',split:false" style="width:200px;">
		<div id="layout_west_accordion" class="easyui-accordion" fit="true" style="width:200px;height:200px;">
					<ul id="tt"></ul>
		</div>
	</div>
	<div data-options="region:'center'"  style="overflow: hidden;">
	 	<div id="tabs" class="easyui-tabs" data-options="border:false,fit:true">  
			<div title="首页" style="display: block;padding: 0 10px;height: 100%;">
						<div style="float: left;margin-top: 20px;">
									<div style="float:left;width:420px;height:200px;margin-left: 15px;">
											<div id="p1" class="easyui-panel" title="系统监控"    style="height:200px;background:#fafafa;"    data-options="iconCls:'icon-save',closable:true,  collapsible:true,maximizable:true">   
											   	 	<p>panel content.</p>   
											   	 	<p>panel content.</p>   
											</div>
									</div>
									<div style="float:left;width:420px;height:200px;margin-left: 35px;">
												<div id="p2" class="easyui-panel" title="文章管理"    style="height:200px;background:#fafafa;"    data-options="iconCls:'icon-save',closable:true,  collapsible:true,minimizable:true,maximizable:true">   
													    <p>panel content.</p>   
													    <p>panel content.</p>   
												</div>
									</div>
							</div>
						
						<div style="float: left;margin-top: 20px;">
									<div style="float:left;width:420px;height:200px;margin-left: 15px;">
											<div id="p3" class="easyui-panel" title="待处理事项"    style="height:200px;background:#fafafa;"    data-options="iconCls:'icon-save',closable:true,  collapsible:true,maximizable:true">   
											   	 	<p>panel content.</p>   
											   	 	<p>panel content.</p>   
											</div>
									</div>
									<div style="float:left;width:420px;height:200px;margin-left: 35px;">
												<div id="p3" class="easyui-panel" title="其他事项"    style="height:200px;padding:10px;background:#fafafa;"    data-options="iconCls:'icon-save',closable:true,  collapsible:true,minimizable:true,maximizable:true">   
													    <p>panel content.</p>   
													    <p>panel content.</p>   
												</div>
									</div>
							</div>
				
				</div>
		 </div>
	</div>

	<!-- <div data-options="region:'east',split:false,title:'设置',collapsible:false,border:false"	style="width: 200px;">
		<div id="cc" class="easyui-calendar" style="width:200px;height:180px;"></div>
		<div id="p" class="easyui-panel" title="登录信息"   style="width:500px;height:150px;padding:10px;background:#fafafa;"   
        data-options="iconCls:'icon-save',fit:true">
        	当前在线人数:
		</div> 
	</div> -->
	
	<%--tab关闭菜单 --%>
     <div id="mm" class="easyui-menu" style="width: 150px;">
        <div id="mm-tabupdate">
            	刷新
          </div>
        <div class="menu-sep">
        </div>
        <div id="mm-tabclose">
          	  	关闭
          </div>
        <div id="mm-tabcloseall">
            	全部关闭
           </div>
        <div id="mm-tabcloseother">
            	除此之外全部关闭
          </div>
        <div class="menu-sep">
        </div>
        <div id="mm-tabcloseright">
            	当前页右侧全部关闭
          </div>
        <div id="mm-tabcloseleft">
            	当前页左侧全部关闭
          </div>
        <div class="menu-sep">
        </div>
        <div id="mm-exit">
            	退出
          </div>
    </div>
      <div id="bg" class="bg" style="display: none;"></div>
</body>
</html>
